<template>
  <view>
  <view class="help-container">

    <view class="list-title">
      <view class="text-title">
        <view class="iconfont icon-github"></view>桃源AI助手-待办事项
      </view>
    </view>

    <uni-segmented-control :current="current" :values="items" :style-type="styleType"
                           :active-color="activeColor" @clickItem="onClickItem" />

    <view class="childList">
      <view v-for="(child, zindex) in taskList" :key="zindex" class="question" hover-class="hover" >
        <view style="display: flex;color: black">
          <view><image @click="handleCheck(child)" v-if="child.isFin==1" src="/static/images/checkbox-1.png" style="width: 40rpx;height: 40rpx;margin-top: 25rpx;margin-left: 15rpx;"></image>
          <image @click="handleCheck(child)" v-if="child.isFin==0" src="/static/images/checkbox-2.png" style="width: 40rpx;height: 40rpx;margin-top: 25rpx;margin-left: 15rpx;"></image>
          </view>
          <view class="text-item" v-if="child.isFin==1" @click="handleDetail(child)"><del>{{ child.todoMemo }}</del></view>
          <view class="text-item" v-if="child.isFin==0" @click="handleDetail(child)">{{ child.todoMemo }}</view>
        </view>
        <view style="display: flex;margin-left: 80rpx;margin-bottom: 15rpx;font-size: 22rpx;">
          <view style="margin-left: 0rpx;">日期：{{ parseTime(child.msgtime, '{y}-{m}-{d} {h}:{i}') }}</view>

        </view>
        <view class="line" v-if="zindex !== taskList.length - 1"></view>
      </view>
    </view>

    <div class="todo-list" v-if="false">
      <table>
        <thead>
        <tr>
          <th>序号</th>
          <th>任务简介</th>
          <th>任务类型</th>
          <th>任务时间</th>
          <th>操作</th>
        </tr>
        </thead>
        <tbody>
        <tr class="expandable" data-id="1">
          <td>1</td>
          <td>任务简介示例</td>
          <td>类型</td>
          <td>2023-05-20 14:00</td>
          <td>
            <button>删除</button>
            <button>修订</button>
            <button>完成</button>
            <button>查看更多</button>
            <button>...</button>
          </td>
        </tr>
        <!-- 展开内容 -->
        <tr class="details" style="display:none;">
          <td colspan="7">
            <div>
              <p><strong>任务特殊字段1:</strong> 示例值</p >
              <p><strong>任务特殊字段2:</strong> 示例值</p >
              <p><strong>任务特殊字段3:</strong> 示例值</p >
              <p><strong>关键字:</strong> 示例</p >
              <p><strong>干系人:</strong> 示例</p >
              <p><strong>地点:</strong> 示例</p >
              <p><strong>数据指标:</strong> 示例</p >
              <p><strong>专业术语:</strong> 示例</p >
              <p><strong>原文:</strong> 示例</p >
            </div>
          </td>
        </tr>
        <!-- 更多任务项... -->
        </tbody>
      </table>
    </div>

  </view>
    <tabBar selection="sign" :taskOwner="taskOwner"></tabBar>
  </view>
</template>

<script>
  import { todoList,todoEdit } from "@/api/system/user"
  import TableCheckbox from "../../uni_modules/uni-table/components/uni-tr/table-checkbox";
  import tabBar from '@/components/tabBar';

  export default {
    components: {TableCheckbox,tabBar},
    data() {
      return {
        items: ['全部', '只看待办', '只看今天','搜索'],
        current: 0,
        lastCurrent: 0,
        colorIndex: 0,
        activeColor: '#666666',
        styleType: 'button',
        loadFin: false,
        pageNum: 1,
        pageSize: 20,
        range: [{"value": 0,"text": "篮球"	}],
        list: [{
            icon: 'iconfont icon-github',
            title: '若依问题',
            childList: [{
              title: '若依开源吗？',
              content: '开源'
            }, {
              title: '若依可以商用吗？',
              content: '可以'
            }, {
              title: '若依官网地址多少？',
              content: 'http://ruoyi.vip'
            }, {
              title: '若依文档地址多少？',
              content: 'http://doc.ruoyi.vip'
            }]
          },
          {
            icon: 'iconfont icon-help',
            title: '其他问题',
            childList: [{
              title: '如何退出登录？',
              content: '请点击[我的] - [应用设置] - [退出登录]即可退出登录',
            }, {
              title: '如何修改用户头像？',
              content: '请点击[我的] - [选择头像] - [点击提交]即可更换用户头像',
            }, {
              title: '如何修改登录密码？',
              content: '请点击[我的] - [应用设置] - [修改密码]即可修改登录密码',
            }]
          }
        ],
        taskList: [],
        taskOwner: '',
        isFin: '',
        todoMemo: '',
        beginMsgtime: '',
        endMsgtime: '',
      }
    },
    onLoad() {
      const query = this.$route.query;
      console.log(query); // 输出URL参数对象
      this.taskOwner = query.taskOwner;
      this.isFin = query.isFin;
      this.current = Number(query.current);
      this.todoMemo = query.todoMemo;
      this.beginMsgtime = query.beginMsgtime;
      this.endMsgtime = query.endMsgtime;

      this.getAITaskList()
    },
    onPullDownRefresh(){
      //下拉刷新
      this.loadFin = false;
      this.taskList = [];
      this.pageNum = 1;
      this.getAITaskList();
    },
    onReachBottom() {
      //触底加载
      if(this.loadFin){
        uni.showToast({ title: "已全部加载完毕", icon: 'success' })
      }else{
        this.pageNum++;
        this.getAITaskList();
      }
    },
    methods: {
      onClickItem(e) {
        console.log(e);
        if (this.current !== e.currentIndex) {
          this.loadFin = false;
          this.taskList = [];
          this.pageNum = 1;

          this.isFin = '';
          this.todoMemo = '';
          this.beginMsgtime = '';
          this.endMsgtime = '';


          if(e.currentIndex == 3){
            this.lastCurrent = this.current;
            this.current = e.currentIndex;
            let that = this;
            setTimeout(function () {
              that.current = 0;//that.lastCurrent;
            }, 500);
            uni.showModal({
              title: '请输入搜索内容',
              prompt: true,
              editable: true,
              success: function (res) {
                if (res.confirm) {
                  console.log('用户点击确定，输入的内容为：' + res.content);
                  that.todoMemo = res.content;

                  that.goAITaskList();
                } else if (res.cancel) {
                  console.log('用户点击取消');

                  that.goAITaskList();
                }
              }
            });

          }else{
            this.current = e.currentIndex;
            switch (this.current) {
              case 0:
                this.goAITaskList();
                break;
              case 1:
                this.isFin = 0;
                this.goAITaskList();
                break
              case 2:
                const currentDate = new Date();
                const year = currentDate.getFullYear();
                const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
                const day = currentDate.getDate();

                const start = year + "-" + month + "-" + day + " 00:00:00";
                const end = year + "-" + month + "-" + day + " 23:59:59";
                const startDate = new Date(start);
                const endDate = new Date(end);

                this.beginMsgtime = startDate.getTime();
                this.endMsgtime = endDate.getTime();

                this.goAITaskList();
                break;
            }
          }
        }
      },
      handleCheck(item){
        if(item.isFin==1){
          item.isFin = 0;
        }else{
          item.isFin = 1;
        }
        let data = {
          id: item.id,
          isFin: item.isFin
        }
        todoEdit(data).then(response => {
          uni.showToast({ title: "操作成功", icon: 'success' })
        })

      },
      goAITaskList(){
        this.$tab.navigateTo(`/pages/aitodo/list?taskOwner=${this.taskOwner}&isFin=${this.isFin}&current=${this.current}&todoMemo=${this.todoMemo}&beginMsgtime=${this.beginMsgtime}&endMsgtime=${this.endMsgtime}`)
      },
      handleText(item) {
        this.$tab.navigateTo(`/pages/common/textview/index?title=${item.title}&content=${item.content}`)
      },
      handleDetail(item) {
        this.$tab.navigateTo(`/pages/aitodo/detail?taskOwner=${this.taskOwner}&id=${item.id}`)
      },
      getAITaskList() {
        let data = {
          pageNum: this.pageNum,
          pageSize: this.pageSize,
          todoOwner: this.taskOwner,
          'params[beginMsgtime]' : this.beginMsgtime,
          'params[endMsgtime]' : this.endMsgtime,
          isFin: this.isFin,
          todoMemo: this.todoMemo,
        }
        todoList(data).then(response => {
          //判断一下 最后一个id 是不是 和 列表最后一个id一样
          console.log(response.rows);
          console.log(response.rows[response.rows.length-1]);
          if(this.taskList.length >0 && response.rows[response.rows.length-1].id == this.taskList[this.taskList.length-1].id){
            this.loadFin = true;
          } else{
            this.taskList = this.taskList.concat(response.rows);
          }
          uni.stopPullDownRefresh();
        })
      },
      parseTime(time, pattern) {
        if (arguments.length === 0 || !time) {
          return null
        }
        const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
        let date
        if (typeof time === 'object') {
          date = time
        } else {
          if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
            time = parseInt(time)
          } else if (typeof time === 'string') {
            time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
          }
          if ((typeof time === 'number') && (time.toString().length === 10)) {
            time = time * 1000
          }
          date = new Date(time)
        }
        const formatObj = {
          y: date.getFullYear(),
          m: date.getMonth() + 1,
          d: date.getDate(),
          h: date.getHours(),
          i: date.getMinutes(),
          s: date.getSeconds(),
          a: date.getDay()
        }
        const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
          let value = formatObj[key]
          // Note: getDay() returns 0 on Sunday
          if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
          if (result.length > 0 && value < 10) {
            value = '0' + value
          }
          return value || 0
        })
        return time_str
      }

    }
  }
</script>

<style lang="scss" scoped>
  page {
    background-color: #f8f8f8;
  }

  .help-container {
    margin-bottom: 100rpx;
    padding: 30rpx;
  }

  .list-title {
    margin-bottom: 30rpx;
  }

  .childList {
    background: #ffffff;
    box-shadow: 0px 0px 10rpx rgba(193, 193, 193, 0.2);
    border-radius: 16rpx;
    margin-top: 10rpx;
  }

  .line {
    width: 100%;
    height: 1rpx;
    background-color: #F5F5F5;
  }

  .text-title {
    color: #303133;
    font-size: 32rpx;
    font-weight: bold;
    margin-left: 10rpx;

    .iconfont {
      font-size: 16px;
      margin-right: 10rpx;
    }
  }

  .text-item {
    font-size: 28rpx;
    padding: 24rpx;
  }

  .question {
    color: #606266;
    font-size: 28rpx;
  }


  table {
    width: 100%;
    border-collapse: collapse;
  }

  th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
  }

  @media (max-width: 600px) {
    th, td {
      display: block;
      width: 100%;
    }
    /* 调整移动端显示 */
  }

  .details {
    background-color: #f9f9f9;
  }

  .example-body {
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex-direction: row;
    padding: 0;
  }

  .uni-common-mt {
    margin-top: 30px;
  }

  .uni-padding-wrap {
    // width: 750rpx;
    padding: 0px 30px;
  }

  .content {
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    justify-content: center;
    align-items: center;
    height: 150px;
    text-align: center;
  }

  .content-text {
    font-size: 14px;
    color: #666;
  }

  .color-tag {
    width: 25px;
    height: 25px;
  }

  .uni-list {
    flex: 1;
  }

  .uni-list-item {
    /* #ifndef APP-NVUE */
    display: flex;
    /* #endif */
    flex: 1;
    flex-direction: row;
    background-color: #FFFFFF;
  }


  .uni-list-item__container {
    padding: 12px 15px;
    width: 100%;
    flex: 1;
    position: relative;
    /* #ifndef APP-NVUE */
    display: flex;
    box-sizing: border-box;
    /* #endif */
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    border-bottom-color: #eee;
  }

  .uni-list-item__content-title {
    font-size: 14px;
  }
</style>
